{include file="public/head"}
<body>
<div class="x-nav">
          <span class="layui-breadcrumb">
            <a href="">首页</a>
            <a>
              <cite>导航管理</cite></a>
          </span>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" onclick="location.reload()" title="刷新">
        <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i></a>
</div>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-body ">
                    <table class="layui-hide" id="test" lay-filter="test"></table>
                    <script type="text/html" id="toolbarDemo">
                        <div class="layui-btn-container">
                        </div>
                    </script>
                    <script type="text/html" id="barDemo">
                        <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
                    </script>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script>
layui.use(['table','form'], function(){
    var table = layui.table
        ,form = layui.form;
    table.render({
        elem: '#test'
        ,url:'{:url("data")}'
        ,toolbar: '#toolbarDemo'
        ,cols: [[
            {type: 'checkbox', fixed: 'left'}
            ,{field:'id', title:'ID', width:80, fixed: 'left', unresize: true}
            ,{field:'title', title:'导航标题'}
            ,{field:'subtitle', title:'导航副标题'}
            ,{field:'url', title:'跳转地址'}
            ,{field:'m_url', title:'手机跳转地址'}
            ,{field:'image', title:'导航图片1',templet:'<div><img src="{{ d.image}}"></div>'}
            ,{field:'image1', title:'导航图片2',templet:'<div><img src="{{ d.image1}}"></div>'}
            ,{field:'sort', title:'排序'}
            ,{field:'create_time', title:'创建时间'}
            ,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:200}
        ]]
        ,page: {limit:20}
    });
    //头工具栏事件
    table.on('toolbar(test)', function(obj){
        var checkStatus = table.checkStatus(obj.config.id);
        switch(obj.event){
            case 'getCheckData':
                let event = checkStatus.data;
                if (event.length == 0){
                    return false;
                }
                let ids = tableCheckedAll(event);
                layer.confirm('确定删除这 '+ event.length +' 行', function(index){
                    $.post('{:url("del")}',{id:ids},function (res) {
                        if (res.code==1){
                            layer.msg(res.msg,{icon:6,time:1000},function () {
                                location.reload();
                            });
                        } else {
                            layer.msg(res.msg,{icon:5,time:3000});
                        }
                    });
                });
                break;
            case 'add':
                xadmin.open('添加','{:url("add")}',420,450);
                break;
        }
    });
    //监听行工具事件
    table.on('tool(test)', function(obj){
        let data = obj.data;
        if(obj.event === 'del'){
            layer.confirm('确定删除这行', function(index){
                $.post('{:url("del")}',{id:data.id},function (res) {
                    if (res.code){
                        layer.msg(res.msg,{icon:6,time:1000},function () {
                            table.reload('test');
                        });
                    } else {
                        layer.msg(res.msg,{icon:5,time:3000});
                    }
                });
            });
        } else if(obj.event === 'edit'){
            xadmin.open('修改','{:url("edit")}?id='+data.id,420,450);
        }
    });
});
</script>
</html>